import { useReducer } from 'react';
import Test1 from '../test1';

type TState = { count: number };
type TAction = { type: string };

const initialState = { count: 0 };
const reducer = (state: TState, action: TAction) => {
  switch (action.type) {
    case 'add':
      return { count: state.count + 1 };
    case 'sub':
      return { count: state.count - 1 };
    default:
      throw new Error();
  }
};

export default function Test() {
  const [state, dispatch] = useReducer(reducer, initialState);
  return (
    <div>
      <Test1 />
      <span>{state.count}</span>
      <br />
      <button
        onClick={() => {
          dispatch({ type: 'add' });
          dispatch({ type: 'add' });
        }}
      >
        +
      </button>
      <br />
      <button onClick={() => dispatch({ type: 'sub' })}>-</button>
    </div>
  );
}
